<template>
    <el-icon class="el-input__icon"><component :is="iconComponent" /></el-icon>
</template>

<script setup lang="ts" name="icons">
import { computed } from 'vue'
import * as svgIcons from '@element-plus/icons-vue'


// 定义父组件传过来的值
const props = defineProps({
  // 输入框前置内容
  name: {
    type: String,
    default: () => '',
  }
})

const elementPlusIconsVue = svgIcons as any

const iconComponent = computed(() => {
    const key:string = props.name
    if(!key)return null
    const compName = key.replace(/^./, key[0].toUpperCase());
    return  key ? elementPlusIconsVue[compName]: null
})


</script>